Diagram formatting is controlled by the DiagramSurface.Formatter property. This is of type IDiagramFormatter. A formatter effectively defines a “theme” or style. For flow diagrams, this is implemented by FlowDiagramFormatter, and for star diagrams by StarDiagramFormatter; for custom diagram types you can create your own implementation of IDiagramFormatter.
You will normally instantiate a formatter in XAML as a resource, and reference the formatter from your DiagramSurface declaration.
The properties of the formatter should be set as follows.
NodeStyleSelector
This allows you to customise the elements that make up a diagram node element: for example, if you want to change the appearance of the resize UI. You will rarely need to specify this property. For more information, see Node Visuals.
ConnectionStyleSelector
A StyleSelector which defines a visual style for each type of connection—typically properties such as colour and thickness. For more information, see Connection Visuals.
NodeContentTemplateSelector
A DataTemplateSelector which selects a DataTemplate for the content of each node in the diagram. For example, a text box in which the user can edit the node content. For more information, see Node Visuals.
ConnectionContentTemplateSelector
A DataTemplateSelector which selects a DataTemplate for the content of each connection in the diagram. For example, a text block displaying a label for a decision branch. For more information, see Connection Visuals.
ConnectionPointTemplateSelector
A DataTemplateSelector which selects a DataTemplate for each connection point in the diagram. This permits fine control over connection point visuals. For more information, see Connection Visuals.
Layout
This allows you to customise where nodes should be placed on the DiagramSurface. By default, nodes are placed at the location specified by their IDiagramNode.Bounds property. You will rarely need to specify this property.
